<template>
  <div class="logo">
    <div class="logo_l">
      <img src="../assets/logo.png" />
    </div>
    <div class="logo_m">
      <h3>省钱利器购物超划算</h3>
      <span>吃喝玩乐尽在美团</span>
    </div>
    <div class="logo_r">
      <button class="button">去APP</button>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.logo {
  width: 375px;
  height: 50px;
  background: #000000;
  display: flex;
}

.logo .logo_l {
  width: 10%;
  height: 50px;
  margin: 5px 5px;
}

.logo .logo_l img {
  width: 36px;
  height: 36px;
  margin-left: 5px;
}

.logo .logo_m {
  width: 60%;
  height: 50px;
  margin-top: 5px;
  margin-left: 5px;
}

.logo .logo_m h3 {
  font-size: 14px;
  color: #fff;
}

.logo .logo_m span {
  font-size: 12px;
  color: #fff;
}

.logo .logo_r {
  width: 30%;
  height: 50px;
}

.logo .logo_r .button {
  width: 50%;
  height: 30px;
  background: #ffcd00;
  border: none;
  border-radius: 5px;
  margin-top: 10px;
  margin-left: 30px;
}
</style>